

export const init = function (box_name, store) {
	  var scrollBoxHeight = 0;
		var scrollBoxWidth = 0;
		var scrollRightWidth=0;
		var innerBoxHeight = 0;
		var innerBoxWidth = 0;
		var innerVerTop = 0;
		var innerVerHeight = 0;
		var innerBoxTop = 0;
		var innerHorLeft = 0;
		var innerHorWidth = 0;
		var innerBoxLeft = 0;
		var timer = '';
		var hiddenVertical = false;
		var hiddenHorizontal = false;
		var showScroll = false;
		
		var showRolling=false; //何时显示滚动条


		var plumbs=function(len){
			let ver=0;
			for (var i = 0;i<len.length; i++) {ver+=len[i].offsetHeight}
			return ver
		}
   
	 var leheing=function(){
		 return  document.documentElement.clientHeight
	 }
	
		// 传入盒子的类名 (现在要传入超大盒子!)
		var parentDiv = document.getElementsByClassName(box_name)[0]

		//  中间大盒子(包含滚动条)
		var scrollBox = parentDiv.getElementsByClassName("sell-box")[0];

		// 单指中间内容盒子
		var innerBox = (parentDiv.getElementsByClassName("sell-right-centen")[0]);
    //垂直的高度
		var innerchui=(innerBox.getElementsByTagName('ul'))

		// 单指中间内容盒子=>标题的父元素
		var innerBoxTop = (innerBox.getElementsByClassName("sell-right-top")[0]);

		// 单指中间内容盒子=>标题的数量
		var innerBoxlenght= (innerBoxTop.getElementsByTagName('li'));

		//内容区域  Rigth
		var scrollRigth = document.getElementsByClassName("sell-right")[0];

		// 底部滚动条父盒子 div
		var horizontalBtn = parentDiv.getElementsByClassName("horizontal")[0];

		// 底部滚动条
		var innerhorSpan = parentDiv.getElementsByClassName("inner_hor")[0];
		


	
	  // 初始化
  var initFun = function () {
    scrollBoxHeight = scrollBox.offsetHeight; //中间大盒子真实高度
		scrollBoxWidth = scrollBox.offsetWidth; //中间大盒子真实宽度
    innerBoxHeight = innerBox.offsetHeight; //中间盒子真实高度
    innerBoxWidth = innerBox.offsetWidth; //中间盒子真实宽度
		scrollRightWidth=scrollRigth.offsetWidth; //右侧区域的宽度
    innerHorWidth = scrollBoxWidth*scrollBoxWidth/ innerBoxWidth*0.1; //底部滚动条宽度
    innerVerHeight = scrollBoxHeight * scrollBoxHeight / innerBoxHeight; //垂直滚条高度
		console.log("setheight",document.documentElement.clientHeight,document.body.clientHeight)
		var winHeight = document.documentElement.clientHeight;
		//滚动条的显示隐藏
		if(winHeight<plumbs(innerchui)){
			showRolling=true;
			horizontalBtn.height=winHeight+"px"
		}else{
			showRolling=false;
		}

  
		console.log("showRolling",showRolling)
    // 兼容处理
    if (document.addEventListener) {
			 // 监听 鼠标 移入
				parentDiv.addEventListener('mouseenter', function (e) {
					
					if(showRolling){
						horizontalBtn.style.display = 'block';
						horizontalBtn.style.height =winHeight+"px";
					}
					// // 可视区域宽度,高度
					// var winHeight = document.documentElement.clientHeight;
					var winWidth = document.documentElement.clientWidth;
					// 当页面高度过高(即有出现滚动条)
					if (winHeight<plumbs(innerchui)) {// 监听window滚动
						isShowhorizontal()
						
						window.addEventListener('scroll', function () {
						isShowhorizontal()
						}, false)
					}
			
					
				 },false)
				 
				 // 鼠标移除事件(让滚动条隐藏)
				parentDiv.addEventListener('mouseleave', function (e) {
					if(showRolling){
						horizontalBtn.style.display = 'none';
						// innerhorSpan.style.height = winHeight+"px";
						}
				}, false);
				
			  //底部滚动条的拖动
				innerhorSpan.addEventListener('mousedown', function (e) {
					// 传的是底部滚动条的dom
					mouseDown(e, 'inner_hor');
					// console.log(e)
					e.target.style.background = "#darksalmon";
					// colorFlag = false;
				}, false);
			
		} 
		else{//下面是兼容 
			 parentDiv.onmouseenter = function (e) {// 监听 鼠标 移入
				 console.log("兼容监听 鼠标 移入")
			 }
			 parentDiv.onmouseleave = function (e) {// 监听 鼠标 移除
				console.log("兼容监听 鼠标 移除")
      };
		}
 
	
	
	}

  //鼠标按下事件 
  var mouseDown = function (e, type) {
    e.preventDefault && e.preventDefault();
    // 获取鼠标按下时的位置
    var startX = e.clientX;
    var startY = e.clientY;

    // 水平拖动
    if (type == 'inner_hor') {
      //当前滚动条位置
      var tempVal = innerHorLeft;
      // 鼠标拖动
      document.onmousemove = function (e) {
        // 获取鼠标拖动时的位置
        var endX = e.clientX;
				var endY = e.clientY;
        // 如底部滚动条处于默认位置(0)
        if (tempVal == 0) {
          innerHorLeft = endY- startY;
          mouseHorizontalMove();
        } else {
          innerHorLeft = tempVal + endY - startY;
          mouseHorizontalMove();
        }
      }
    }

    // 鼠标松开时,移除拖动事件
    document.onmouseup = function (e) {
      document.onmousemove = null;
      // colorFlag = true;
    }
  }
	


	
  // 底部滚动条移动时
  var mouseHorizontalMove = function () {
		/**
		 * innerHorLeft  滚动条默认宽度innerBoxLeft
		 * scrollBoxWidth  //中间大盒子真实宽度
		 * innerHorWidth   //底部滚动条宽度
		 * innerBoxWidth   //中间盒子真实宽度
		 * */

var winHeight = document.documentElement.clientHeight;
		if (innerHorLeft >=leheing()-60) {//到底了
				let sp=winHeight-100
				innerhorSpan.style.bottom =leheing+'px';
				innerBox.style.bottom =sp+ 'px';
				console.log("1",innerHorLeft)
				document.getElementsByClassName("sell-son")[0].style.marginTop=-innerHorLeft+ 'px'
		}else if (innerHorLeft <= 0) {//到头了
				innerHorLeft = 0;
				innerhorSpan.style.top = 0 + 'px';
				innerBox.style.top = 0 + 'px';
				document.getElementsByClassName("sell-son")[0].style.marginTop=-innerHorLeft+ 'px'
				console.log("2",innerHorLeft)
		}else{
				innerhorSpan.style.top = innerHorLeft + 'px';
				let sp=innerHorLeft.toFixed(5)/(scrollRightWidth-innerHorWidth).toFixed(5)*(scrollBoxWidth-scrollRightWidth)
				// innerBox.style.top =  + 'px';
				document.getElementsByClassName("sell-son")[0].style.marginTop=-innerHorLeft+ 'px'
				console.log("3",innerHorLeft,document.getElementsByClassName("sell-son")[0])
		}
// 		let timer;
// 		clearTimeout(timer)
// 		  timer = setTimeout(() => {
// 		 	store.commit("scrolljs/setLeftPull",innerHorLeft);
// 		}, 25)
		
	
    
		
					
		
  }
	
	//  170815 新增,当有页面高度过高,出现滚动条时,移入就让底部滚动条显示,并判断是固定还是fixed
  // 判断是否显示底部滚动条
	
	var isShowhorizontal = function () {
    var winHeight = document.documentElement.clientHeight;
    var winWidth = document.documentElement.clientWidth;
		
    var scrollTop = 0;
    var scrollHeight = 0;
		console.log("pppp",winHeight,innerHorLeft)
		
		if(document.documentElement.scrollTop<40){
			horizontalBtn.style.top=40+"px"
			console.log("到头了")
			document.getElementsByClassName("sell-son")[0].style.marginTop=innerHorLeft
		}else if(document.documentElement.scrollTop>winHeight-66){
			horizontalBtn.style.top=0
			horizontalBtn.style.height=winHeight-66
			document.getElementsByClassName("sell-son")[0].style.marginTop=innerHorLeft
			console.log("到底了")
		}else if(document.documentElement.scrollTop<winHeight-66)
		{
			console.log("到中间")
			horizontalBtn.style.height=winHeight-146+"px"
			horizontalBtn.style.top=0
			document.getElementsByClassName("sell-son")[0].style.marginTop=innerHorLeft
		}
		
		
    if (document.documentElement && document.documentElement.scrollTop) {
      scrollTop = document.documentElement.scrollTop;
      scrollHeight = document.documentElement.scrollHeight;//网页正文全文高
    } else if (document.body) {
      scrollTop = document.body.scrollTop;
      scrollHeight = document.documentElement.scrollHeight;
    }
    // 判断win的滚动条触底了,去掉底部滚动的fixed,否则让 底部滚动条 fixed
		console.log(Math.ceil(scrollTop),scrollHeight,winHeight)
//     if (Math.ceil(scrollTop) > scrollHeight - winHeight ) {
//        horizontalBtn.style.position = '';
//        horizontalBtn.style.width = '100%'
//        horizontalBtn.style.left = 0;
// 			 horizontalBtn.style.bottom = -16+"px"
//        horizontalBtn.style.background = 'rgba(255,255,255,0.05)'
//     } else {
//       horizontalBtn.style.position = 'fixed'
//       horizontalBtn.style.width = scrollBoxWidth + 'px'
//       horizontalBtn.style.left = getLeft(scrollBox) + 'px'
// 			horizontalBtn.style.bottom =0
//       horizontalBtn.style.background = 'rgba(255,255,255,0.05)'
//     }
  }
	
		// 获取距离顶部的距离
	var getTop = function (e) {
	  var offset = e.offsetTop;
	  if (e.offsetParent != null) offset += getTop(e.offsetParent);
	  return offset;
	}
	  // 获取距离左侧的距离
	var getLeft = function (e) {
	  var offset = e.offsetLeft;
	  if (e.offsetParent != null) offset += getLeft(e.offsetParent);
	  return offset;
	}
	
  initFun();
	window.onresize = function () {
    scrollBoxHeight = 0;
    scrollBoxWidth = 0;
		scrollRightWidth=0;
    innerBoxHeight = 0;
    innerBoxWidth = 0;
    innerVerTop = 0;
    innerVerHeight = 0;
    innerBoxTop = 0;
    innerHorLeft = 0;
    innerHorWidth = 0;
    innerBoxLeft = 0;
    timer = '';
    hiddenVertical = false;
    hiddenHorizontal = false;
    showScroll = false;
    initFun();
    innerBox.style.top = 0;
    innerBox.style.left = 0;
  }

	
}